{% extends "/shared/layout.html" %}
{% block mainContent %}
<div class="header">
  <div class="wrapper">
    <ul>
     <li>
       {% include '/game/game_summary_partial.html' %}
     </li>
     <li>
       <div class="g_info">
          <dl>
            <dd>
              <h1>{{game_info.map_game_name}}</h1>
            </dd>
            <dd>
              <label>{{pageRes.lblStartDate}}：</label><span class="h1">{{game_info.start_date}}</span>
            </dd>
            <dd>
              <label>{{pageRes.lblKM}}：</label><span class="h1">{{game_info.map_info.length}}</span>{{layoutRes.unitKM}}
            </dd>
            <dd>
              <label>{{pageRes.lblPosition}}：</label><span class="h1">{{pageRes.lblToEnd}}{{game_info.position}}</span>{{layoutRes.unitKM}}
            </dd>
            <dd>
              <label>{{pageRes.lblUsedTime}}：</label><span class="h1">{{game_info.duration}}</span>{{layoutRes.unitDay}}
            </dd>
          </dl>
       </div>
     </li>
   </ul>
  </div>
</div>
<div class="wrapper">
  <div class="game_map mapContent">
      <div class="map_detail" style="background-image:url('../static/images/maps/{{game_info.map_info.map_picture}}')">
        <div class="map_name">{{game_info.map_game_name}}</div>
      </div>
  </div>
</div>
<script type="text/javascript" src="../static/scripts/views/game/etlinking.views.mapGameInfo.js"></script>
<script type="text/javascript">
  $(function() {
    var points = {{game_info.points|tojson|safe}};
    nsbase.views.mapGameInfo.init(points);
  });
</script>
{% endblock %}